<template>
  <div>
    <div class="list-box">
      <div class="head-box">
        <search-form
          ref="searchForm"
          :search-config="searchConfig"
          :label-width="150"
          @clear="clearSearch"
          @search="handleSearch"
        />
      </div>
      <c-permission-tabs v-model="activeType" code="tab">
        <el-tab-pane label="全部" name="all" opt-code="all">
          <List
            :active-type="activeType"
            :serach-filters="searchFilters"
            type="all"
          />
        </el-tab-pane>
        <el-tab-pane label="待提交" name="submit" opt-code="submit">
          <List :active-type="activeType" :serach-filters="searchFilters" type="submit" />
        </el-tab-pane>
        <el-tab-pane label="待审核" name="audit" opt-code="audit">
          <List :active-type="activeType" :serach-filters="searchFilters" type="audit" />
        </el-tab-pane>
        <el-tab-pane label="档案维护" name="fileMaintenance" opt-code="fileMaintenance">
          <List :active-type="activeType" :serach-filters="searchFilters" type="fileMaintenance" />
        </el-tab-pane>
      </c-permission-tabs>
    </div>
  </div>
</template>

<script>
import List from './list'
import { getDictByPatchType } from '@/api/dataDict'

export default {
  name: 'StoreAddEva',
  components: { List },
  data() {
    return {
      activeType: '',
      searchFilters: [],
      searchConfig: [
        {
          type: 'select',
          prop: 'state',
          label: '选址评估进度',
          config: {
            remote: true,
            remoteUrl: '/data-dict/api/v2/dictionary/SHOP_LOCATION_EVAL_STATE?appCode=slm&domainCode=marketing',
            defaultProps: { label: 'dictName', value: 'dictCode' }
          }
        },
        {
          type: 'select',
          prop: 'marketSubdType',
          label: '门店建设类型',
          filter: true,
          config: {
            filterable: false, // 是否允许输入关键字搜索
            selectData: [] // 选项集合
          }
        },
        {
          type: 'select',
          prop: 'businessType',
          label: '商家类型',
          filter: true,
          config: {
            filterable: false, // 是否允许输入关键字搜索
            remoteUrl: '/data-dict/api/v2/dictionary/BIZMAN_TYPE?appCode=slm&domainCode=marketing',
            defaultProps: { label: 'dictName', value: 'dictCode' }
          }
        },
        { label: '办事处', prop: 'officeCode', type: 'dialog',
          config: {
            defaultProps: { label: 'name', value: 'code' }
          },
          dialogConfig: {
            title: '办事处',
            interfacePath: '/select-service/api/v1/organization/page',
            filtersRaw: [{ 'id': 'isOffice', 'property': 'isOffice', 'value': '1', 'operator': '=' }],
            setting: [{ prop: 'code', title: '编码', width: 120 }, { prop: 'name', title: '名称', width: 250 }]
          }
        },
        { label: '商家姓名', prop: 'customerName', type: 'text', value: '', placeholder: '', filter: true },
        { label: '商家电话', prop: 'customerPhone', type: 'text', value: '', placeholder: '', filter: true },
        { label: '卖场详细地址', prop: 'shopAddress', type: 'text', value: '', placeholder: '', filter: true }
      ]
    }
  },
  computed: {},
  watch: {},
  created() {
    this.getDictByPatchTypeAll()
  },
  methods: {
    // 清空搜索条件
    clearSearch(data) {
      this.searchFilters = []
    },
    // 获取搜索条件
    handleSearch(data) {
      this.searchFilters = data.filtersRaw
    },
    async getDictByPatchTypeAll() {
      const { CONST_TYPE } = await getDictByPatchType(['CONST_TYPE'])
      CONST_TYPE.slice(0, 2).forEach(el => {
        this.searchConfig[1].config.selectData.push({ label: el.dictName, value: el.dictCode })
      })
    }
  }
}
</script>

<style lang="scss" scoped>
.colorSetRed{
  color: red;
}
.head-box{
}
.tableUpButton{
  margin: 10px;
}
  .button{
    margin: 0px !important;
    width: 100px;
    border: 1px solid #dcdcdc;
  }
  .down-button{
    color: black;
  }
  .form{
    border: 1px solid #dcdcdc;
    padding: 20px;
  }
</style>
